<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			/* 1.未访问的链接 a:link  把没有点击过的(访问过的)链接选出来 */
			a:link {
				color: #333;
				text-decoration: none;
			}

			/*2. a:visited 选择点击过的(访问过的)链接 */
			a:visited {
				color: orange;
			}

			/*3. a:hover 选择鼠标经过的那个链接 */
			a:hover {
				color: skyblue;
			}

			/* 4. a:active 选择的是我们鼠标正在按下还没有弹起鼠标的那个链接 */
			a:active {
				color: green;
			}

			.wp {
				width: 10px;
				height: 12px;
				background-color: pink;
				margin-top: 6px;
			}

			div .me {
				color: red;
			}
		</style>
	</head>
	<body>
		<!-- div{$}*5 -->
		<div>
			<div class="me">
				wp
			</div>
			12
		</div>
		<div>2</div>
		<div>3</div>
		<div>4</div>
		<div>5</div>
		<!-- div{文字}*6 -->
		<div>wp</div>
		<div>wp</div>
		<div>wp</div>
		<div>wp</div>
		<div>wp</div>
		<div>wp</div>
		<!-- .demo$*5 -->
		<div class="wp"></div>
		<div class="wp"></div>
		<div class="wp"></div>
		<div class="wp"></div>
		<div class="wp"></div>
		<div class="wp"></div>
	</body>
</html>
